<template>
	<div>
		<el-button type="primary" style="margin-bottom: 5px;">新建跟进</el-button>
		<el-table :data="tableData" border>
			<el-table-column type="expand" label="文件" width="80">
				<template #="{ row }">
					<el-main>
						<el-descriptions title="跟进内容">
							<el-descriptions-item>{{ row.followContent }}</el-descriptions-item>
						</el-descriptions>
						<el-descriptions title="文件列表" border>
							<el-descriptions-item>
								<template #label>
									<div
										style="display: flex;justify-content: center;align-items: center; width: 50px;">
										文件名
									</div>
								</template>
								<template v-for="item in row.files" :key="item.id">
									<p v-copy="item.url">{{ item.name }}</p>
								</template>
							</el-descriptions-item>
						</el-descriptions>
					</el-main>
				</template>
			</el-table-column>
			<el-table-column label="跟进方式" prop="followMethod" :formatter="getFlowMethod"></el-table-column>
			<el-table-column label="跟进时间" prop="followTime"></el-table-column>
			<el-table-column label="下次跟进时间" prop="followNextTime"></el-table-column>
			<el-table-column label="顾问老师" prop="roleManName"></el-table-column>
		</el-table>
	</div>
</template>

<script setup lang="ts">
import { getFollowPageApi } from '@renderer/api/recruit';
import { useDicts } from '@renderer/composables/dicts';
import { FollowPageItem } from '@renderer/interface/recruit';
import { onMounted, ref } from 'vue';

const form = ref({
	current: 1,
	size: 5,
	customerId: localStorage.getItem('clientDetail') as string
})
const tableData = ref<FollowPageItem[]>([])
const getFollowPageData = async () => {
	const { code, data } = await getFollowPageApi(form.value)
	if (code !== '200') return

	tableData.value = data.records
}
const { dicts } = useDicts(['recruit_follow_method'])
const getFlowMethod = (row: FollowPageItem) => dicts.value.recruit_follow_method.find(item => item.v == row.followMethod)!.k

onMounted(() => {
	getFollowPageData()
})
</script>

<style scoped></style>